html,
body{
	width: 100%;
	height: 100%;
	margin: 0px;
}
.container{
	display: grid;
	grid-template-rows: 35px 132px 60px 1fr 82px;
	grid-template-areas:"top"
						"header"
						"lan"
						"content"
						"tail";
}
.top{
	display: grid;
	grid-area:top;
	background-color: #0062ac;
	padding-left: 300px; 
	padding-right: 300px;
	height: 35px;
	grid-template-columns:300px 1fr 100px 100px 100px 100px 100px;
	grid-template-areas:"time  gap  wechat  mail  home  map  search";
}
.top-time{
	display: grid;
	grid-area:time;
	color: #fff;
	height: 35px;
	text-align: center;
	margin-top: 5px;
}
.top-wechat{
	display: grid;
	grid-area:wechat;
	grid-template-columns: 40px 1fr;
	height: 35px;
	padding-top: 8px;
	margin: 0px;
	color: #FFFFFF;
}
.top-wechat-logo{
	width:17px;
	height:14px;
	padding-left: 15px;
	padding-top: 5px;
}
.top-mail{
	display: grid;
	grid-area:mail;
	grid-template-columns: 40px 1fr;
	height: 35px;
	padding-top: 8px;
	margin: 0px;
	color: #FFFFFF;
}
.top-mail-logo{
	width:17px;
	height:14px;
	padding-left: 15px;
	padding-top: 5px;
}
.top-home{
	display: grid;
	grid-area:home;
	height: 35px;
	padding-top: 8px;
	margin: 0px;
	color: #FFFFFF;
}
.top-map{
	display: grid;
	grid-area:map;
	color: #fff;	
	height: 35px;
	padding-top: 8px;
	margin: 0px;
	color: #FFFFFF;
}
.top-search{
	display: grid;
	grid-area:"search";
	color: #fff;
	height: 35px;
	padding-top: 8px;
	margin: 0px;
	color: #FFFFFF;
}
.header{
	display: grid;
	grid-area:header;
	grid-template-columns:590px 330px;
	grid-gap:250px;
	background-color: #eef9fd;
	padding-right: 300px;
	padding-left: 300px;
}
.header-image1{
	width: 100%;
    height: auto;
    max-height: 90px;
    padding-top: 30px;
    padding-bottom: 20px;
}
.header-image2{
    width: 100%;
    height: auto;
    max-height: 90px;
    padding-top: 40px;
    padding-bottom: 50px;
}

.lan{
	display: grid;
	grid-area:lan;
	background-color: #0062AC;
	padding-left: 300px;
	padding-right: 300px;
	grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr ;
}
.lan-content{
	text-align: center;
	color:#fff;
}
/*已完成*/


.content{
	display: grid;
	grid-area:content;
	grid-template-rows:480px 150px 430px 480px;
	grid-template-columns:1fr 1fr;
	grid-template-areas:"a b"
					    "c c"
					    "e f"
					    "g h";
	grid-gap:20px;
	padding-left: 300px;
	padding-right:300px;
}
.card1{
	grid-area:a;
	margin-top: 20px;
}
.card1_2{
	grid-area:b;
	margin-top: 20px;
}
.card2{
	display: grid;
	grid-area:c;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-gap: 20px;
}
.c1{
	background-color: rgb(0,98,172);
	text-align:center;
	padding-top: 20px;
}
.c2{
	background-color: rgb(36,169,230);
	text-align:center;
	padding-top: 20px;
}
.c3{
	background-color: rgb(248,182,44);
	text-align:center;
	padding-top: 20px;
}
.c4{
	background-color: rgb(11,162,153);
	text-align:center;
	padding-top: 20px;
}
.card-image{
	width:60px;
	height:60px;
}


.news-item{
	vertical-align: top;
    overflow: hidden;
    position: relative;
    height: 36px;
    line-height: 34px;
    border-bottom: 1px dashed #DEDEDE;
    padding-left: 0px;
}

.news_date {
    font-size: 14px;
    color: #999999;
    width: 23%;
    float: right;
    line-height: 35px;
    text-align: right;
}





.tail{
	display: grid;
	grid-area:tail;
	background-color: #0062Af;
}
.footer {
    color: #fff;
    line-height: 24px;
    font-size: 14px;
    text-align: center;
    margin: 12px;
}
